<template>
  <div>
    <!-- 循环取值 -->
    <div>
      <div>
        <van-cell-group>
          <van-cell value="待支付" @click="toxiangqing">
            <template #title>
              <span class="title">订单编号:12345564</span>
            </template>
          </van-cell>
        </van-cell-group>
      </div>
      <van-card
        num="2"
        price="2.00"
        desc="描述信息"
        title="商品标题"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        @click="xinxi"
      />
      <div class="jine">
        <div class="jineflot">应付金额:¥180:00</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },

  components: {},

  computed: {},

  methods: {
    toxiangqing(){
      this.$router.push('/xiangQing')
    },
    xinxi(){
      this.$router.push('/ProductInfo')
    }
  },
};
</script>
<style lang="less" scoped>
.nav_bar ::v-deep .van-nav-bar__title {
  max-width: 60%;
  margin: 0 auto;
  color: #999999;
  font-weight: 500;
  font-size: 20px;
  font-weight: 600;
}
.van-nav-bar .van-icon {
  color: green;
}

.van-card__num {
  margin-top: -50px;
  color: green;
}
.van-card__price {
  margin-bottom: 10px;
}
.van-cell__value > span {
  color: red;
}
.title {
  color: #999999;
}
.jine {
  width: 100%;
  height: 50px;
  border: solid 1px #f2f2f2;
  color: #999999;
  line-height: 50px;
}
.jineflot {
  float: right;
  margin-right: 10px;
}
.goodsbox {
  margin-top: 10px;
}
</style>
